<template>
  <div class="BrandPage">
    <div class="Top" :class="{ smallFontSize: showEdition, mediumFontSize: !showEdition }">
      <ul>
        <li v-if="contentData.length > 0" v-for="(item, index) in contentData" @click="contentDataClick(item)" :key="index">
          <p style="font-weight: bold; height: 30px">
            <span style="float: left">农户姓名：{{ item.HOUSEAPPLICANT }}</span>
            <span v-if="item.F_RESULT == 1 || item.F_RESULT == 2" style="float: right; color: rgb(0, 122, 255)" :style="{ fontSize: !showEdition ? '14px' : '12px' }">电子门牌</span>
            <span v-else style="float: right; color: rgb(144, 143, 148)" :style="{ fontSize: !showEdition ? '14px' : '12px' }">电子门牌</span>
          </p>
          <p style="color: #848484; height: 30px" :style="{ fontSize: !showEdition ? '14px' : '12px' }">
            <span style="float: left">进度：{{ item.SBZT }}</span>
            <span style="float: right; color: #848484" :style="{ fontSize: !showEdition ? '14px' : '12px' }">申请时间：{{ item.F_CREATETIME }}</span>
          </p>
          <p style="height: 30px">
            <span style="float: left" :style="{ fontSize: !showEdition ? '14px' : '12px' }">地址：{{ item.CONSTRUCITONADDRESS ? item.CONSTRUCITONADDRESS : '暂无数据' }}</span>
          </p>
        </li>
      </ul>
      <div style="height: 60vh; text-align: center; padding-top: 20vh" v-if="contentData.length == 0">
        <div style="margin-bottom: 10px">
          <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
        </div>
        <div>暂无数据</div>
      </div>
    </div>
    <!-- <div class="bottom">
        <ul>
          <li
            :key="index"
            v-for="(item, index) in bottomData"
            @click="bottomClick(index)"
            :style="{
            color: nowIndex === index ? '#007AFF' : '#908f94',
            fontSize: '18px',

          }"
          >
            <img v-if="nowIndex === index" :src="item.icon" />
            <img v-else :src="item.icons" />
            <p>{{ item.name }}</p>
          </li>
        </ul>
      </div> -->
    <!--<div :class="{smallFontSize:showEdition,mediumFontSize:!showEdition}" style="height: 50px;background: #007AFF;line-height: 50px;text-align: center;color: #ffffff;font-weight: bold;">提交</div>-->
  </div>
</template>
<script>
import { QuerySignCallback } from '@/utils/api'
export default {
  name: 'BrandPage',
  data() {
    return {
      nowIndex: 1,
      bottomData: [
        {
          name: '首页',
          icon: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/20.png',
          icons: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/20-1.png'
        },
        {
          name: '我的待办',
          icons: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/21.png',
          icon: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/21-1.png'
        }
      ],
      showEdition: false,
      contentData: [
        // {
        //   HOUSEAPPLICANT: '1111',
        //   APPLYPHONE: 'HOUSEAPPLICANT',
        //   CONSTRUCITONADDRESS: 'APPLYTIME',
        // }
      ]
    }
  },
  mounted() {
    this.getData()
    // this.getcontentData()
    if (ZWJSBridge) {
      ZWJSBridge.setTitle({
        title: '门牌办理'
      })
        .then((res) => {})
        .catch((err) => {})
    }
    this.showEdition = this.$store.state.Edition
  },
  methods: {
    // getcontentData: async function(){
    //   debugger
    //     let idcard = JSON.parse(window.localStorage.getItem("userName")).idcard||''
    //
    //     let paer = {
    //         procName: 'up_loans',
    //         dtParams: JSON.stringify([{ I_USERID: idcard, I_TYPE: 1 }])
    //     }
    //     let params = {
    //         accessCode: '69db6bece3a7480592e2ec753d1e335e',
    //         cityCode: window.localStorage.getItem('citycode') ? window.localStorage.getItem('citycode') : '441300000000',
    //         params: paer
    //     }
    //     const res = await QuerySignCallback(params)
    //     let data = eval('(' + res.data.data + ')')
    //     this.contentData = data.Data;
    // },
    getData: async function () {
      if (!window.localStorage.getItem('citycodeChange')) {
        this.$toast.fail('请先选择当前需要查询的地市')
        return
      }
      if (!window.localStorage.getItem('token') || window.localStorage.getItem('token') == 'null' || window.localStorage.getItem('token') == null) {
        this.$toast.fail('经查询，您未在本应用办理建房业务，无法一键办理门牌，请联系民政部门申办')
        return
      }
      let idcard = window.localStorage.getItem('DanDianid') || ''
      //idcard = '360781199807156133'
      let paerknh = {
        procName: 'MPBL',
        dtParams: JSON.stringify([{ I_USERID: "'" + idcard + "'", TYPE: 1 }]),
        token: window.localStorage.getItem('token')
      }
      let params4 = {
        accessCode: '69db6bece3a7480592e2ec753d1e335e',
        cityCode: window.localStorage.getItem('citycodeChange') ? window.localStorage.getItem('citycodeChange') : '441300000000',
        params: paerknh
      }
      const resEXknh = await QuerySignCallback(params4)
      if (JSON.parse(resEXknh.data.data)?.['异常消息']) {
        this.$toast.fail(JSON.parse(resEXknh.data.data)?.['异常消息'])
        return
      }
      console.log(JSON.parse(resEXknh.data.data).Data)
      if (JSON.parse(resEXknh.data.data).Data.length > 0) {
        let paerknh1 = {
          procName: 'MPBL',
          dtParams: JSON.stringify([{ I_USERID: "'" + idcard + "'", TYPE: 2 }]),
          token: window.localStorage.getItem('token')
        }
        let params41 = {
          accessCode: '69db6bece3a7480592e2ec753d1e335e',
          cityCode: window.localStorage.getItem('citycodeChange') ? window.localStorage.getItem('citycodeChange') : '441300000000',
          params: paerknh1
        }
        const resEXknh1 = await QuerySignCallback(params41)
        if (JSON.parse(resEXknh1.data.data).Data.length > 0) {
          let paerknh2 = {
            procName: 'MPBL',
            dtParams: JSON.stringify([{ I_USERID: "'" + idcard + "'", TYPE: 3 }]),
            token: window.localStorage.getItem('token')
          }
          let params42 = {
            accessCode: '69db6bece3a7480592e2ec753d1e335e',
            cityCode: window.localStorage.getItem('citycodeChange') ? window.localStorage.getItem('citycodeChange') : '441300000000',
            params: paerknh2
          }
          const resEXknh2 = await QuerySignCallback(params42)
          if (JSON.parse(resEXknh2.data.data)?.['异常消息']) {
            this.$toast.fail(JSON.parse(resEXknh2.data.data)?.['异常消息'])
            return
          }
          console.log(JSON.parse(resEXknh2.data.data).Data)
          this.contentData = JSON.parse(resEXknh2.data.data).Data
        } else {
          this.$toast.fail('经查询，您的建房业务尚在审批中，请在审批完成后再申请门牌')
        }
      } else {
        this.$toast.fail('经查询，您未在本应用办理建房业务，无法一键办理门牌，请联系民政部门申办')
      }
    },
    //获取门照
    getPhoto: async function (item) {
      debugger
      let params = {
        accessCode: '0087bf6662ef11ec87416805cab640a0',
        cityCode: window.localStorage.getItem('citycode') ? window.localStorage.getItem('citycode') : '',
        params: {
          mainCodetype: '身份证',
          mainName: item.APPLYPHONE,
          mainCode: item.CERTIFICATECODE,
          certcode: ''
        }
      }
      const res = await QuerySignCallback(params)
      if (res.data.code != 200) {
        this.$toast.fail('门牌正在制作中,请耐心等待!')
      } else {
      }
      // if(res.data.code == 200){
      //this.hideImg = false
      // this.ImgUrl =
    },
    contentDataClick(item) {
      debugger
      //判断状态为1，2 则不用进入模块 直接查看图片，其他的则需要进模块申请
      if (item.F_RESULT == '1' || item.F_RESULT == '2') {
        //获取门牌照图片
        //this.$toast.fail("已提交！");
        this.getPhoto(item)
      } else {
        this.$router.push({
          path: '/BrandSendApplic',
          query: { data: item }
        })
      }
    },
    bottomClick(index) {
      if (index == 0) {
        this.$router.push({
          path: '/ZLJIndex'
        })
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.BrandPage {
  .Top {
    width: 100vw;
    overflow-x: hidden;
    height: calc(100vh - 60px);
    overflow-y: auto;
    background: #fff;
    padding: 0 10px;
    li {
      padding-top: 10px;
      border-bottom: 1px solid #d2d2d2;
    }
  }
  .mediumFontSize {
    font-size: 20px;
  }
  .bottom {
    clear: both;
    // position: fixed;
    bottom: 0;
    // height: 100px;
    width: 100%;
    text-align: center;
    height: 60px;
    background: #ffffff;
    border-top: 1px solid #d2d2d2;
    ul {
      width: 100%;
      height: 100%;
      clear: both;
      overflow: hidden;
      display: flex;
      align-items: center;
      li {
        float: left;
        width: 50%;
        font-size: 14px !important;
        img {
          height: 18px;
          margin-bottom: 0.013px;
        }
      }
    }
  }
}
</style>
